<template>
  <div>
    <el-dialog v-drag :title="!dataForm.productId ? '新增药品' : '修改药品'" width="55%" :close-on-click-modal="false"
      :visible.sync="visible">
      <!-- 步骤条 -->
      <el-steps :space="200" :active="activeIndex - 0" align-center finish-status="success">
        <el-step title="基本信息"></el-step>
        <el-step title="库存信息"></el-step>
        <el-step title="价格信息"></el-step>
        <el-step title="GSP设置"></el-step>
        <el-step title="拆零设置"></el-step>
        <el-step title="提成设置"></el-step>
        <el-step title="养护设置"></el-step>
        <el-step title="药品图片"></el-step>
        <el-step title="药品说明"></el-step>
        <el-step title="完成"></el-step>
      </el-steps>

      <el-form :model="dataForm" :inline="true" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
        label-width="80px" >
        <el-tabs type="border-card" :tab-position="tabPosition" v-model="activeIndex" style="margin-top: 25px"
          :before-leave="beforeLeaveTab" @tab-click="tabClick">

          <el-tab-pane label="基本信息" name="0" >
            <el-form-item label="药品分类" prop="cateList">
              <el-cascader size="mini" placeholder="请选择分类"
                ref="cateCascader"
                :key="cateKey"
                v-model="dataForm.cateIds"
                expand-trigger="hover"
                :options="cateList" filterable clearable
                @change="handleCascaderChange"
                :props="casProps"
                :show-all-levels="true">
              </el-cascader>
            </el-form-item>
            <el-form-item label="产品编号" prop="productCode">
              <el-input size="mini" disabled v-model="dataForm.productCode" placeholder="产品编号"></el-input>
            </el-form-item>
            <el-form-item label="产品名称" prop="productName">
              <el-input size="mini" v-model="dataForm.productName" @blur="initPinYin()" placeholder="产品名称"></el-input>
            </el-form-item>
            <el-form-item label="条形码" prop="barCode">
              <el-input size="mini" type="number" v-model="dataForm.barCode" placeholder="条形码"></el-input>
            </el-form-item>
            <el-form-item label="通用名">
              <el-input size="mini" v-model="dataForm.genericName" placeholder="通用名"></el-input>
            </el-form-item>
            <el-form-item label="助记码" prop="pinyin">
              <el-input size="mini" v-model="dataForm.pinyin" placeholder="助记码"></el-input>
            </el-form-item>
            <el-form-item label="产地" prop="producingArea">
              <el-input size="mini" v-model="dataForm.producingArea" placeholder="产地"></el-input>
            </el-form-item>
            <el-form-item label="规格" prop="standard">
              <el-input size="mini" v-model="dataForm.standard" placeholder="规格"></el-input>
            </el-form-item>
            <el-form-item label="单位" prop="unit">
              <el-select size="mini" @focus="getDicts('UNIT')"  v-model="dataForm.unit" clearable placeholder="请选择">
                <el-option v-for="item in units" :key="item.value" :label="item.label" :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="厂家" prop="produceFactory">
              <el-input size="mini" v-model="dataForm.produceFactory" placeholder="厂家"></el-input>
            </el-form-item>
            <el-form-item label="货位编号">
              <el-input size="mini" v-model="dataForm.goodsAllocation" placeholder="货位编号"></el-input>
            </el-form-item>
            <el-form-item label="品牌名称" prop="brandName">
              <el-select size="mini" v-model="dataForm.brandName" clearable placeholder="请选择">
                <el-option v-for="item in brands" :key="item.brandName" :label="item.brandName"
                  :value="item.brandName">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="批准文号" prop="approvalNo">
              <el-input size="mini" v-model="dataForm.approvalNo" placeholder="批准文号"></el-input>
            </el-form-item>
            <el-form-item label="有效时长" prop="expiryDay">
              <el-input size="mini" type="number" v-model="dataForm.expiryDay" placeholder="有效时长(天)"></el-input>
            </el-form-item>
            <el-form-item label="剂型" prop="dosageForm">
              <el-select size="mini" @focus="getDicts('DOSAGE_FORM')" v-model="dataForm.dosageForm"  clearable placeholder="请选择">
                <el-option v-for="item in dosageForms" :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="外部编码">
              <el-input size="mini" v-model="dataForm.outCode" placeholder="外部编码"></el-input>
            </el-form-item>
            <el-form-item label="陈列区">
              <el-input size="mini" v-model="dataForm.exhibitionArea" placeholder="陈列区"></el-input>
            </el-form-item>
            <br/>
            <el-form-item label="是否医保">
              <el-checkbox size="mini" v-model="dataForm.isYiBao"></el-checkbox>
            </el-form-item>
            <el-form-item label="是否审核">
              <el-checkbox size="mini" v-model="dataForm.isAudit" disabled></el-checkbox>
            </el-form-item>
            <el-form-item label="是否取消">
              <el-checkbox size="mini" v-model="dataForm.isCancel" disabled></el-checkbox>
            </el-form-item>
            <el-form-item label="是否积分">
              <el-checkbox size="mini" v-model="dataForm.isScore" ></el-checkbox>
            </el-form-item>
            <el-form-item label="是否折扣">
              <el-checkbox size="mini" v-model="dataForm.isDiscount" ></el-checkbox>
            </el-form-item>
            <el-form-item label="是否首营">
              <el-checkbox size="mini" v-model="dataForm.isFirstSale" ></el-checkbox>
            </el-form-item>
            <el-form-item label="是否赠品">
              <el-checkbox size="mini" v-model="dataForm.isGift" ></el-checkbox>
            </el-form-item>
          </el-tab-pane>

          <el-tab-pane label="库存信息" name="1">
            <el-form-item label="库存上线">
              <el-input size="mini" type="number" v-model="dataForm.storageUpper" placeholder="库存上线"></el-input>
            </el-form-item>
            <el-form-item label="库存下线">
              <el-input size="mini" type="number" v-model="dataForm.storageFloor" placeholder="库存下线"></el-input>
            </el-form-item>
            <el-form-item label="限购数量">
              <el-input size="mini" type="number" v-model="dataForm.limitCount" placeholder="限购数量"></el-input>
            </el-form-item>
            <el-form-item label="总库存">
              <el-input size="mini" disabled v-model="dataForm.totalStorage" placeholder="总库存"></el-input>
            </el-form-item>
            <el-form-item label="采购数量">
              <el-input size="mini" type="number" disabled v-model="dataForm.purchaseTotalNum" placeholder="采购总数量"></el-input>
            </el-form-item>
          </el-tab-pane>

          <el-tab-pane label="价格信息" name="2">
            <el-form-item label="批发价" prop="tradePrice">
              <el-input size="mini" type="number" v-model="dataForm.wholesalePrice" placeholder="批发价"></el-input>
            </el-form-item>
            <el-form-item label="最新采购价" prop="purchasePrice">
              <el-input size="mini" type="number" disabled v-model="dataForm.purchasePrice" placeholder="最新采购价"></el-input>
            </el-form-item>
            <el-form-item label="原采购价" prop="purchaseOldPrice">
              <el-input size="mini" type="number" disabled v-model="dataForm.purchaseOldPrice" placeholder="原采购价"></el-input>
            </el-form-item>
            <el-form-item label="平均成本" prop="averagePrice">
              <el-input size="mini" type="number" disabled v-model="dataForm.averagePrice" placeholder="平均成本价"></el-input>
            </el-form-item>
            <el-form-item label="指导售价" prop="retailPrice">
              <el-input size="mini" type="number" v-model="dataForm.retailPrice" placeholder="指导零售价"></el-input>
            </el-form-item>
            <el-form-item label="当前售价" prop="salePrice">
              <el-input size="mini" type="number" v-model="dataForm.salePrice" placeholder="售价"></el-input>
            </el-form-item>
            <el-form-item label="会员价" prop="memberPrice">
              <el-input size="mini" type="number" v-model="dataForm.memberPrice" placeholder="会员价"></el-input>
            </el-form-item>
            <el-form-item label="最高价">
              <el-input size="mini" type="number" v-model="dataForm.topPrice" placeholder="最高价"></el-input>
            </el-form-item>
            <el-form-item label="最低价">
              <el-input size="mini" type="number" v-model="dataForm.lowestPrice" placeholder="最低价"></el-input>
            </el-form-item>
            <el-form-item label="折扣价">
              <el-input size="mini" type="number" v-model="dataForm.discountPrice" placeholder="折扣价"></el-input>
            </el-form-item>
            <el-form-item label="售价1">
              <el-input size="mini" type="number" v-model="dataForm.sellingPrice1" placeholder="售价1"></el-input>
            </el-form-item>
            <el-form-item label="售价2">
              <el-input size="mini" type="number" v-model="dataForm.sellingPrice2" placeholder="售价2"></el-input>
            </el-form-item>
            <el-form-item label="价格浮动">
              <el-input size="mini" type="number" v-model="dataForm.priceFloat" placeholder="售价2"></el-input>
            </el-form-item>
            <el-form-item label="利润">
              <el-input size="mini" type="number" disabled v-model="dataForm.profit" placeholder="售价2"></el-input>
            </el-form-item>
            <el-form-item label="利润率">
              <el-input size="mini" type="number" disabled v-model="dataForm.profitRate" placeholder="售价2"></el-input>
            </el-form-item>
          </el-tab-pane>

           <el-tab-pane label="GSP设置" name="3">
            <el-form-item label="药品类型">
              <el-select size="mini" @focus="getDicts('DRUG_TYPE')" v-model="dataForm.drugType"  clearable placeholder="请选择">
                <el-option v-for="item in gspDrugTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="验收标准">
              <el-select size="mini" @focus="getDicts('CHECK_ATTR')" v-model="dataForm.acceptanceLevel"  clearable placeholder="请选择">
                <el-option v-for="item in gspAcceptLevels " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="保存条件">
              <el-select size="mini" @focus="getDicts('SAVE_CONDITION')" v-model="dataForm.storageCondition"  clearable placeholder="请选择">
                <el-option v-for="item in storageConditions " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="注册证号">
              <el-input size="mini" v-model="dataForm.gspRegisterNo" placeholder="注册证号"></el-input>
            </el-form-item>
            <el-form-item label="注册商标">
              <el-input size="mini" v-model="dataForm.gspRegisterTrademark" placeholder="注册商标"></el-input>
            </el-form-item>
            <el-form-item label="产品性状">
              <el-input size="mini" v-model="dataForm.characterInfo" placeholder="产品性状"></el-input>
            </el-form-item>
            <el-form-item label="功能分类">
              <el-select size="mini" @focus="getDicts('DRUG_FUNCTION')" v-model="dataForm.gspFuncType"  clearable placeholder="请选择">
                <el-option v-for="item in gspFuncTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="经营范围">
              <el-select size="mini" @focus="getDicts('SCOPE_TYPE')" v-model="dataForm.gspScopeType"  clearable placeholder="请选择">
                <el-option v-for="item in gspScopeTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="特殊药品">
              <el-select size="mini" @focus="getDicts('SPECIAL_TYPE')" v-model="dataForm.gspSpecialType"  clearable placeholder="请选择">
                <el-option v-for="item in gspSpecialTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="OTC分类">
              <el-select size="mini" @focus="getDicts('OTC_TYPE')" v-model="dataForm.otcClass"  clearable placeholder="请选择">
                <el-option v-for="item in gspOctTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="ABC分类">
              <el-select size="mini" @focus="getDicts('ABC_TYPE')" v-model="dataForm.abcClass"  clearable placeholder="请选择">
                <el-option v-for="item in gspAbcTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="器械类别">
              <el-select size="mini" @focus="getDicts('INSTRUMNET_TYPE')" v-model="dataForm.instrumnetType"  clearable placeholder="请选择">
                <el-option v-for="item in instrumnetTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="季节属性">
              <el-select size="mini" @focus="getDicts('SEASON_TYPE')" v-model="dataForm.seasonClass"  clearable placeholder="请选择">
                <el-option v-for="item in seasonClasses " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="核心品种">
              <el-select size="mini" @focus="getDicts('CORE_TYPE')" v-model="dataForm.coreItemClass"  clearable placeholder="请选择">
                <el-option v-for="item in coreItemClasses " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="配送必备">
              <el-select size="mini" @focus="getDicts('DELIVERY_TYPE')" v-model="dataForm.deliveryRequireClass"  clearable placeholder="请选择">
                <el-option v-for="item in deliveryRequireClasses " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>

            <el-divider></el-divider>

            <el-form-item label="是否中药" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isDrug"></el-checkbox>
            </el-form-item>
            <el-form-item label="是否处方" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isRxDrug"></el-checkbox>
            </el-form-item>
            <el-form-item label="是否GMP" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isGmp"></el-checkbox>
            </el-form-item>
            <el-form-item label="凭处方单销售" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isNeedPrescription"></el-checkbox>
            </el-form-item>
            <el-form-item label="含麻黄碱" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isEphedrine"></el-checkbox>
            </el-form-item>
            <el-form-item label="退热药" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isColdMedicine"></el-checkbox>
            </el-form-item>
            <el-form-item label="进口药" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isImportedDrug"></el-checkbox>
            </el-form-item>
            <el-form-item label="中药饮片" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isDrugPiece"></el-checkbox>
            </el-form-item>
            <el-form-item label="是否疫苗" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isVaccine"></el-checkbox>
            </el-form-item>
            <el-form-item label="含兴奋剂" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isStimulant"></el-checkbox>
            </el-form-item>
            <el-form-item label="是否保健品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isHealthFood"></el-checkbox>
            </el-form-item>
            <el-form-item label="是否食品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isFood"></el-checkbox>
            </el-form-item>
            <el-form-item label="蛋白同化制剂" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isEggPreparation"></el-checkbox>
            </el-form-item>
            <el-form-item label="二类精神药品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isTwoClassmentalDrug"></el-checkbox>
            </el-form-item>
            <el-form-item label="含肽类激素" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isThormone"></el-checkbox>
            </el-form-item>
            <el-form-item label="一类精神药品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isMindDrug"></el-checkbox>
            </el-form-item>
            <el-form-item label="危险化学品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isDangerChemistry"></el-checkbox>
            </el-form-item>
            <el-form-item label="麻醉药品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isAnesthetic"></el-checkbox>
            </el-form-item>
            <el-form-item label="医疗用毒性品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isMedicalToxicity"></el-checkbox>
            </el-form-item>
            <el-form-item label="诊断试剂" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isDiagnosticReagent"></el-checkbox>
            </el-form-item>
            <el-form-item label="含兴奋剂药品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isStimulant"></el-checkbox>
            </el-form-item>
            <el-form-item label="收货防串码" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isEan1"></el-checkbox>
            </el-form-item>
            <el-form-item label="拣货防串码" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isEan2"></el-checkbox>
            </el-form-item>
            <el-form-item label="终止妊娠品" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isTermination"></el-checkbox>
            </el-form-item>
            <el-form-item label="低温品种" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.lowTemperature"></el-checkbox>
            </el-form-item>
          </el-tab-pane>

          <el-tab-pane label="拆零设置" name="4">
            <el-form-item label="是否拆零药" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isSplit" :disabled="isSplit"  @change="splitHandle"></el-checkbox>
            </el-form-item>
            <el-form-item label="能否拆零" class="split" label-width="120px">
              <el-checkbox size="mini" :disabled="isCanSplit" v-model="dataForm.isCanSplit"  @change="canSplitHandle"></el-checkbox>
            </el-form-item>
            <br />
            <el-form-item label="每盒拆为多少个" class="split">
              <el-input size="mini" type="number" :disabled="isCanSplit" v-model="dataForm.splitNum"  placeholder="拆为多少个"></el-input>
            </el-form-item>
            <br />
            <el-form-item label="拆零后药品单位" class="split">
              <el-select size="mini" v-model="dataForm.afterSplitUnit" @focus="getDicts('SPLITED_UNIT')"  clearable :disabled="isCanSplit"  placeholder="请选择">
                <el-option v-for="item in splitedUnits" :key="item.value" :label="item.label" :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
          </el-tab-pane>

          <el-tab-pane label="提成设置" name="5">
            <el-form-item class="commission" label="是否提成">
              <el-checkbox size="mini" v-model="dataForm.isCommission"></el-checkbox>
            </el-form-item>
            <br />
            <el-form-item class="commission" label="提成类型">
              <el-select size="mini" @focus="getDicts('COMMISSION_TYPE')" v-model="dataForm.commissionType" @change="commissionHandler"  clearable placeholder="请选择">
                <el-option v-for="item in commissionTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <br />
            <el-form-item class="commission" :label="commissionLabel">
              <el-input size="mini" type="number" v-model="dataForm.commissionAmount" :placeholder="commissionLabel">
              </el-input>
              <span v-text="commissionUnit"></span>
            </el-form-item>
         <!--   <br />
            <el-form-item class="commission" label="每销售一件提成多少元">
              <el-input size="mini" type="number" v-model="dataForm.commissionBySaleNum" placeholder="每销售一件提成多少元">
              </el-input>
              <span>元</span> -->
            </el-form-item>
          </el-tab-pane>
          <el-tab-pane label="养护设置" name="6">
            <el-form-item label="养护类型">
              <el-select size="mini" @focus="getDicts('MAINTEN_TYPE')" v-model="dataForm.conserveType"  clearable placeholder="请选择">
                <el-option v-for="item in gspMaintenanceTypes " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="养护理由">
              <el-select size="mini" @focus="getDicts('MAINTEN_REASON')" v-model="dataForm.conserveReason"  clearable placeholder="请选择">
                <el-option v-for="item in gspMaintenanceReasons " :key="item.itemId" :label="item.label"
                  :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="养护措施">
              <el-input size="mini" v-model="dataForm.conserveMeasure" placeholder="养护措施"></el-input>
            </el-form-item>
            <el-form-item label="是否重点养护" label-width="120px">
              <el-checkbox size="mini" v-model="dataForm.isMainConserve"></el-checkbox>
            </el-form-item>
          </el-tab-pane>
          <el-tab-pane label="药品图片" name="7">
            <el-upload
              :action="uploadUrl"
              :on-preview="handleImgPreview"
              :on-remove="handleImgRemove"
              :on-success="handImgSuccess"
              :headers="headers"
              :file-list="dataForm.pics"
              :drag="false"
              :before-upload="handleBeforeUpload"
              list-type="picture"
              multiple name="file"
              :data="uploadData">
              <el-button size="small" type="primary">点击上传</el-button>
              <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
            </el-upload>
          </el-tab-pane>
          <el-tab-pane label="药品说明" name="8">
            <el-form-item label="业务员">
              <el-input size="mini" v-model="dataForm.salesman" placeholder="业务员"></el-input>
            </el-form-item>
            <el-form-item label="业务电话">
              <el-input size="mini" v-model="dataForm.salesmanMobile" type="number" placeholder="业务电话"></el-input>
            </el-form-item>
            <el-form-item label="产品效果">
              <quill-editor ref="effect" v-model="dataForm.effect" class="editor" :options="editorOption" />
            </el-form-item>
            <el-form-item label="备注信息:">
              <quill-editor ref="remark" v-model="dataForm.remark" class="editor" :options="editorOption" />
            </el-form-item>
          </el-tab-pane>

        </el-tabs>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="visible = false">取消</el-button>
        <el-button size="mini" type="primary" @click="dataFormSubmit()">确定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="图片预览" :visible.sync="imgDialogVisible" width="50%">
      <img :src="previewPath" alt="">
    </el-dialog>
  </div>
</template>

<script>
  // import _ from 'loadash'
  const _ = require("lodash")
  export default {
    data() {
      return {
        visible: false,
        activeIndex: "0",
        tabPosition: 'left',
        //图片预览路径
        previewPath: '',
        imgDialogVisible: false,
        uploadUrl: window.SITE_CONFIG.baseUrl + '/common/upload',
        fits: ['fill', 'contain', 'cover', 'none', 'scale-down'],
        headers: {
          Authorization: "Bearer " + this.$cookie.get('token'),
          token: this.$cookie.get('token')
        },
        uploadData: {
          file: ''
        },
        // 富文本编辑器配置
        editorOption: {
          placeholder: '请输入......'
        },
        curPic: {},
        cateList: [],
        cateKey: 0,
        units: [],
        brands: [],
        casProps:{
          value: 'categoryId',
          label: 'categoryName',
          children: 'children'
        },
        dataForm: {
          cateIds:[],
          productId: null,
          categoryName:'',
          categoryId: '',
          productCode: '',
          productName: '',
          producingArea: '',
          standard: '',
          unit: '',
          pinyin: '',
          totalStorage: 0,
          wholesalePrice: 0,
          retailPrice: 0,
          purchasePrice: 0,
          salePrice: 0,
          memberPrice: 0,
          barCode: '',
          isRxDrug: false,
          approvalNo: '',
          produceFactory: '',
          dosageForm: '',
          expiryDay: 0,
          isYiBao: false,
          isGmp: false,
          isDrug: false,
          priceFloat: 0,
          isCanSplit: false,
          isSplit: false,
          afterSplitUnit: '',
          splitNum: 0,
          isAudit: false,
          isCancel: false,
          storageUpper: 0,
          storageFloor: 0,
          isMainConserve: false,
          isDrugPiece: false,
          isCommission: false,
          commissionRadio: 0,
          profit: 0,
          profitRate: 0,
          commissionAmount: 0,
          isNeedPrescription: false,
          limitCount: 0,
          purchaseTotalNum: 0,
          isColdMedicine: false,
          dataSource: '',
          genericName: '',
          tradeOldPrice: 0,
          averagePrice: 0,
          sellingPrice1: 0,
          sellingPrice2: 0,
          discountPrice: 0,
          topPrice: 0,
          lowestPrice: 0,
          propertyId: 0,
          propertyName: '',
          acceptanceLevel: '',
          storageCondition: '',
          standardCode: '',
          proviceStandard: '',
          effect: '',
          characterInfo: '',
          brandName: '',
          drugType: '',
          goodsAllocation: '',
          gspType: '',
          gspFuncType: '',
          gspScopeType: '',
          gspSpecialType: '',
          gspRegisterNo: '',
          gspRegisterTrademark: '',
          conserveType: '',
          conserveReason: '',
          conserveMeasure: '',
          isScore: false,
          isDiscount: false,
          isFirstSale: false,
          isGift: false,
          isImportedDrug: false,
          instrumnetTypeId: 0,
          isEggPreparation: false,
          isTwoClassmentalDrug: false,
          isEphedrine: false,
          isThormone: false,
          isMindDrug: false,
          isDangerChemistry: false,
          isAnesthetic: false,
          isMedicalToxicity: false,
          isVaccine: false,
          isDiagnosticReagent: false,
          isStimulant: false,
          isEan1: false,
          isEan2: false,
          isHealthFood: false,
          isFood: false,
          isTermination: false,
          storeRequireClass: '',
          otcClass: '',
          seasonClass: '',
          coreItemClass: '',
          deliveryRequireClass: '',
          arearangeName: '',
          lowTemperature: false,
          abcClass: '',
          exhibitionArea: '',
          isWebSale: false,
          salesman: '',
          salesmanMobile: '',
          outCode: '',
          pics:[]
        },
        dataRule: {
          productCode: [{
            required: true,
            message: '产品编号不能为空',
            trigger: 'blur'
          }],
          productName: [{
            required: true,
            message: '产品名称不能为空',
            trigger: 'blur'
          }],
          categoryName: [{
            required: true,
            message: '类别名称不能为空',
            trigger: 'blur'
          }],
          pinyin: [{
            required: true,
            message: '助记码不能为空',
            trigger: 'blur'
          }],
          producingArea: [{
            required: true,
            message: '产地不能为空',
            trigger: 'blur'
          }],
          standard: [{
            required: true,
            message: '规格不能为空',
            trigger: 'blur'
          }],
          unit: [{
            required: true,
            message: '单位不能为空',
            trigger: 'blur'
          }],
          wholesalePrice: [{
            required: true,
            message: '批发价不能为空',
            trigger: 'blur'
          }],
          retailPrice: [{
            required: true,
            message: '指导零售价不能为空',
            trigger: 'blur'
          }],
          salePrice: [{
            required: true,
            message: '售价不能为空',
            trigger: 'blur'
          }],
          memberPrice: [{
            required: true,
            message: '会员价不能为空',
            trigger: 'blur'
          }],
          barCode: [{
            required: true,
            message: '条形码不能为空',
            trigger: 'blur'
          }],
          approvalNo: [{
            required: true,
            message: '批准文号不能为空 ',
            trigger: 'blur '
          }],
          produceFactory: [{
            required: true,
            message: '厂家不能为空',
            trigger: 'blur'
          }],
          dosageForm: [{
            required: true,
            message: '剂型不能为空',
            trigger: 'blur'
          }],
          expiryDay: [{
            required: true,
            message: '有效时长(天)不能为空',
            trigger: 'blur'
          }],
        },
        gspDrugTypes:[],
        gspMaintenanceTypes:[],
        gspAcceptLevels:[],
        storageConditions:[],
        gspFuncTypes: [],
        gspScopeTypes: [],
        gspSpecialTypes: [],
        gspOctTypes: [],
        gspAbcTypes: [],
        instrumnetTypes: [],
        gspMaintenanceReasons:[],
        dosageForms: [],
        seasonClasses: [],
        coreItemClasses: [],
        deliveryRequireClasses: [],
        commissionTypes: [],
        splitedUnits: [],
        commissionUnit: '%',
        isCanSplit: false,
        isSplit: false,
        commissionLabel: '提成比率'
      }
    },
    computed: {
      //三级分类id
      categoryId() {
        if (this.cateList.length === 2) {
          return this.cateList[1]
        }else if (this.cateList.length === 3) {
           return this.cateList[2]
        }
        return null
      },
      brandName() {
        if (this.dataForm.brandValue) {
          return this.dataForm.brandValue
        }
      },
    },
    created() {
      //获取药品分类
      this.getCateList()
      this.getBrands();
    },
    methods: {
      init(productId) {
        this.visible = true
        if(productId){
          this.dataForm.productId = productId
          this.$nextTick(() => {
            this.$refs['dataForm'].resetFields()
            if (this.dataForm.productId) {
              this.$http({
                url: `/product/info/info/${this.dataForm.productId}`,
                method: 'get',
                params: this.$http.adornParams()
              }).then(({
                data
              }) => {
                if (data && data.code === 0) {
                  let addForm = data.data
                  addForm.isYiBao = addForm.isYiBao === 1? true:false
                  addForm.isRxDrug = addForm.isRxDrug === 1? true:false
                  addForm.isGmp = addForm.isGmp === 1? true:false
                  addForm.isDrug = addForm.isDrug === 1? true:false
                  addForm.isCanSplit = addForm.isCanSplit === 1? true:false
                  addForm.isSplit = addForm.isSplit === 1? true:false
                  addForm.isAudit = addForm.isAudit === 1? true:false
                  addForm.isCancel = addForm.isCancel === 1? true:false
                  addForm.isMainConserve = addForm.isMainConserve === 1? true:false
                  addForm.isDrugPiece = addForm.isDrugPiece === 1? true:false
                  addForm.isCommission = addForm.isCommission === 1? true:false
                  addForm.isNeedPrescription = addForm.isNeedPrescription === 1? true:false
                  addForm.isColdMedicine = addForm.isColdMedicine === 1? true:false

                  addForm.isScore = addForm.isScore === 1? true:false
                  addForm.isDiscount = addForm.isDiscount === 1? true:false
                  addForm.isFirstSale = addForm.isFirstSale === 1? true:false
                  addForm.isGift = addForm.isGift === 1? true:false
                  addForm.isImportedDrug = addForm.isImportedDrug === 1? true:false
                  addForm.isEggPreparation = addForm.isEggPreparation === 1? true:false
                  addForm.isTwoClassmentalDrug = addForm.isTwoClassmentalDrug === 1? true:false
                  addForm.isEphedrine = addForm.isEphedrine === 1? true:false
                  addForm.isThormone = addForm.isThormone === 1? true:false
                  addForm.isMindDrug = addForm.isMindDrug === 1? true:false
                  addForm.isDangerChemistry = addForm.isDangerChemistry === 1? true:false
                  addForm.isAnesthetic = addForm.isAnesthetic === 1? true:false
                  addForm.isMedicalToxicity = addForm.isMedicalToxicity === 1? true:false
                  addForm.isVaccine = addForm.isVaccine === 1? true:false
                  addForm.isDiagnosticReagent = addForm.isDiagnosticReagent === 1? true:false
                  addForm.isStimulant = addForm.isStimulant === 1? true:false
                  addForm.isEan1 = addForm.isEan1 === 1? true:false
                  addForm.isEan2 = addForm.isEan2 === 1? true:false
                  addForm.isHealthFood = addForm.isHealthFood === 1? true:false
                  addForm.isFood = addForm.isFood === 1? true:false
                  addForm.isTermination = addForm.isTermination === 1? true:false
                  addForm.isWebSale = addForm.isWebSale === 1? true:false
                  addForm.lowTemperature = addForm.lowTemperature === 1? true:false

                  this.dataForm = addForm

                  this.isCanSplit = addForm.isSplit ? true: false
                  this.isSplit = addForm.isCanSplit ? true: false

                  if(addForm.commissionType === '每销售一件提成多少元'){
                    this.commissionUnit = '元'
                    this.commissionLabel = '提成金额'
                  }else{
                    this.commissionUnit = '%'
                    this.commissionLabel = '提成比率'
                  }

                }
              })
            }
          })
        }else{
          this.getMaxCode()
        }
      },
      async getMaxCode() {
        const res = await this.$http({
          url: 'product/info/getMaxCode',
          method: 'get'
        })
        let data = res.data
        if (data && data.code === 0) {
          this.dataForm.productCode = data.data
        }
      },
      async getBrands() {
        const res = await this.$http({
          url: '/product/infobrand/listBrands',
          method: 'get'
        })
        let data = res.data
        if (data && data.code === 0) {
          this.brands = data.data
        }
      },
      async getCateList() {
        const res = await this.$http({
          url: `/product/category/getTree`,
          method: 'get',
          params: this.$http.adornParams({'level': 3})
        })
        let data = res.data
        if (data && data.code === 0) {
          this.cateKey ++;
          this.cateList = data.data;
        }
      },
      async getDicts(type) {
        const res = await this.$http({
          url: '/base/basedict/getDict',
          method: 'get',
          params: this.$http.adornParams({
            'code': type
          })
        })
        let data = res.data
        if (data && data.code === 0) {
          if(type === 'DRUG_TYPE'){
            this.gspDrugTypes = data.data
          }else if(type === 'MAINTEN_TYPE'){
            this.gspMaintenanceTypes = data.data
          }else if(type === 'CHECK_ATTR'){
            this.gspAcceptLevels = data.data
          }else if(type === 'SAVE_CONDITION'){
            this.storageConditions = data.data
          }else if(type === 'DRUG_FUNCTION'){
            this.gspFuncTypes = data.data
          }else if(type === 'SCOPE_TYPE'){
            this.gspScopeTypes = data.data
          }else if(type === 'SPECIAL_TYPE'){
            this.gspSpecialTypes = data.data
          }else if(type === 'OTC_TYPE'){
            this.gspOctTypes = data.data
          }else if(type === 'UNIT'){
            this.units = data.data
          }else if(type === 'MAINTEN_REASON'){
            this.gspMaintenanceReasons = data.data
          }else if(type === 'DOSAGE_FORM'){
            this.dosageForms = data.data
          }else if(type === 'ABC_TYPE'){
            this.gspAbcTypes = data.data
          }else if(type === 'INSTRUMNET_TYPE'){
            this.instrumnetTypes = data.data
          }else if(type === 'SEASON_TYPE'){
            this.seasonClasses = data.data
          }else if(type === 'CORE_TYPE'){
            this.coreItemClasses = data.data
          }else if(type === 'DELIVERY_TYPE'){
            this.deliveryRequireClasses = data.data
          }else if(type === 'COMMISSION_TYPE'){
            this.commissionTypes = data.data
          }else if(type === 'SPLITED_UNIT'){
            this.splitedUnits = data.data
          }

        }
      },
      // 表单提交
      dataFormSubmit() {
        this.$refs['dataForm'].validate(async (valid) => {
          if (valid) {
            let addForm = _.cloneDeep(this.dataForm)
            addForm.isRxDrug = addForm.isRxDrug ? 1:0
            addForm.isYiBao = addForm.isYiBao ? 1:0
            addForm.isGmp = addForm.isGmp ? 1:0
            addForm.isDrug = addForm.isDrug ? 1:0
            addForm.isCanSplit = addForm.isCanSplit ? 1:0
            addForm.isSplit = addForm.isSplit ? 1:0
            addForm.isAudit = addForm.isAudit ? 1:0
            addForm.isCancel = addForm.isCancel ? 1:0
            addForm.isMainConserve = addForm.isMainConserve ? 1:0
            addForm.isDrugPiece = addForm.isDrugPiece ? 1:0
            addForm.isCommission = addForm.isCommission ? 1:0
            addForm.isNeedPrescription = addForm.isNeedPrescription ? 1:0
            addForm.isColdMedicine = addForm.isColdMedicine ? 1:0

            addForm.isScore = addForm.isScore ? 1:0
            addForm.isDiscount = addForm.isDiscount ? 1:0
            addForm.isFirstSale = addForm.isFirstSale ? 1:0
            addForm.isGift = addForm.isGift ? 1:0
            addForm.isImportedDrug = addForm.isImportedDrug ? 1:0
            addForm.isEggPreparation = addForm.isEggPreparation ? 1:0
            addForm.isTwoClassmentalDrug = addForm.isTwoClassmentalDrug ? 1:0
            addForm.isEphedrine = addForm.isEphedrine ? 1:0
            addForm.isThormone = addForm.isThormone ? 1:0
            addForm.isMindDrug = addForm.isMindDrug ? 1:0
            addForm.isDangerChemistry = addForm.isDangerChemistry ? 1:0
            addForm.isAnesthetic = addForm.isAnesthetic ? 1:0
            addForm.isMedicalToxicity = addForm.isMedicalToxicity ? 1:0
            addForm.isVaccine = addForm.isVaccine ? 1:0
            addForm.isDiagnosticReagent = addForm.isDiagnosticReagent ? 1:0
            addForm.isStimulant = addForm.isStimulant ? 1:0
            addForm.isEan1 = addForm.isEan1 ? 1:0
            addForm.isEan2 = addForm.isEan2 ? 1:0
            addForm.isHealthFood = addForm.isHealthFood ? 1:0
            addForm.isFood = addForm.isFood ? 1:0
            addForm.isTermination = addForm.isTermination ? 1:0
            addForm.isWebSale = addForm.isWebSale ? 1:0
            addForm.lowTemperature = addForm.lowTemperature ? 1:0

            const res = await this.$http({
              url: `/product/info/${!this.dataForm.productId ? 'save' : 'update'}`,
              method: 'post',
              data: this.$http.adornData(addForm)
            })
            let data = res.data
            if (data && data.code === 0) {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.visible = false
                  this.$emit('refreshDataList')
                }
              })
            } else {
              this.$message.error(data.msg)
            }
          }
        })
      },
      handleCascaderChange(value) {
        if(value && value[0] && value[1]){
          if(value[2]){
             this.dataForm.categoryId = value[2]
          }else{
             this.dataForm.categoryId = value[1]
          }
          const nodes = this.$refs.cateCascader.getCheckedNodes()[0]
          this.dataForm.categoryName = nodes.label
        }
      },
      //切换tab
      beforeLeaveTab(activeName, oldActiveName) {
        // if (oldActiveName === '0' && this.dataForm.cateList.length !== 2) {
        //   this.$message.warning('不能切换!请选择二级分类!');
        //   return false
        // }
        // return true
      },
      tabClick() {
        // if (this.activeIndex === '1') {
        //   //动态参数
        //   this.getGoodsParams('many')
        // } else if (this.activeIndex === '2') {
        //   //静态参数
        //   this.getGoodsParams('only')
        // }
      }, //图片预览
      splitHandle(value){
        this.isCanSplit = value ? true: false
      },
      canSplitHandle(value){
        this.isSplit = value ? true: false
      },
      commissionHandler(value){
        if(value === '每销售一件提成多少元'){
          this.commissionUnit = '元'
          this.commissionLabel = '提成金额'
        }else{
          this.commissionUnit = '%'
          this.commissionLabel = '提成比率'
        }
      },
      handleImgPreview(file, fileList) {
        this.previewPath = file.url
        this.imgDialogVisible = true
      },
      //图片删除
      handleImgRemove(file) {
        //找到索引
        const index = this.dataForm.pics.findIndex(x =>
          x.url === file.url
        )
        //根据索引删除
        this.dataForm.pics.splice(index, 1)
      },
      //上传之前
      handleBeforeUpload(file){
        this.curPic = {
          "name": file.name,
          "size": file.size,
          "suffix": file.type,
          "type": 1,
          "uid": file.uid,
          "status": 1,
        }
      },
      //上传成功
      handImgSuccess(response) {
        if (response.code === 0) {
          this.curPic.url = response.data
          this.dataForm.pics.push(this.curPic)
        }
      },
      initPinYin(){
        let name = this.dataForm.productName
        this.$pinyin.setOptions({checkPolyphone:false,charCase:0});
        this.dataForm.pinyin = this.$pinyin.getCamelChars(name)
      },

    }
  }
</script>
<style lang="less" scoped>
  .el-tabs {
      height: 100%;
      line-height: 100%;
  }
  .el-dialog__body {
    padding: 0px 20px 30px 20px;
  }

  .el-form-item__label {
    white-space: pre-line;
  }

  .el-divider {
    margin: 0;
    padding: 0;
  }

  .commission {
    width: 380px;

    /deep/ .el-form-item__label {
      width: 180px !important;
    }

    /deep/ .el-form-item__content {
      display: inline-flex !important;
    }
  }

  .split {
    width: 320px;

    /deep/ .el-form-item__label {
      width: 120px !important;
    }

    /deep/ .el-form-item__content {
      display: inline-flex !important;
    }
  }
  .editor {
    line-height: normal !important;
  }
</style>
